@import '../themes/variable.scss';
@import 'vxe-table/styles/index';

input[class*='vxe-'],
button[class*='vxe-'] {
	transition: all 0.3s, height 0s !important;

	&:not(.is--disabled):focus {
		box-shadow: 0 0 0 3px rgba($vxe-primary-color, 20%);
	}
}

.vxe-button {
	&.type--button.size--large {
		height: $vxe-button-height-large;

		&.is--round {
			border-radius: 40px;
		}
	}
}

.vxe-toolbar {
	padding: 8px 12px;
}

.vxe-grid,
.vxe-table {
	background: #fff;
	//padding-bottom: 1px;

	.vxe-grid--toolbar-wrapper {
		border-left: 1px solid $vxe-border-color-light;
		border-right: 1px solid $vxe-border-color-light;
	}

	.vxe-body--row .ant-tag {
		min-width: 55px;
		text-align: center;
	}

	.vxe-table.border--default {
		.vxe-table--body-wrapper .vxe-table--body {
			margin-bottom: 1px;
		}

		.vxe-body--row.row--hover {
			box-shadow: 0px 4px 8px 0px rgba($vxe-primary-color, 0.1);
			background: linear-gradient(to left, $vxe-primary-color, $vxe-primary-color) left top no-repeat, linear-gradient(to bottom, $vxe-primary-color, $vxe-primary-color) left top no-repeat, linear-gradient(to left, $vxe-primary-color, $vxe-primary-color) right top no-repeat, linear-gradient(to bottom, $vxe-primary-color, $vxe-primary-color) right top no-repeat, linear-gradient(to left, $vxe-primary-color, $vxe-primary-color) left bottom no-repeat, linear-gradient(to bottom, $vxe-primary-color, $vxe-primary-color) left bottom no-repeat, linear-gradient(to left, $vxe-primary-color, $vxe-primary-color) right bottom no-repeat, linear-gradient(to left, $vxe-primary-color, $vxe-primary-color) right bottom no-repeat;
			background-size: 100% 1px, 2px 100%, 1px 100%, 0px 100%;

			td {
				background-image: linear-gradient(transparent, transparent);
			}
		}

		.vxe-table--fixed-left-wrapper {
			.vxe-body--row.row--hover {
				background-size: 100% 1px, 2px 100%, 0px 100%, 0px 100%;
			}
		}

		.vxe-table--fixed-right-wrapper {
			.vxe-body--row.row--hover {
				background-size: 100% 1px, 0px 100%, 2px 100%, 0px 100%;
			}
		}
	}

	.vxe-pager.is--background {
		button.vxe-pager--prev-btn,
		button.vxe-pager--next-btn {
			background: #fff;
			box-shadow: none;
		}

		.vxe-pager--num-btn {
			&:focus {
				box-shadow: 0 0 0 2px rgba($vxe-primary-color, 20%);
			}

			&.is--active {
				border-radius: 0;
			}
		}
	}

	.vxe-grid--bottom-wrapper {
		.vxe-toolbar.is--perfect {
			border-top: none;
			border-bottom-width: 1px;
		}
	}

	.vxe-cell--checkbox.is--disabled .vxe-checkbox--icon {
		background: $vxe-disabled-color;
		border-radius: $vxe-border-radius;
	}
}
